<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
	<link href="style.css" rel="stylesheet" type="text/css" />
	<script src="jquery-1.8.1.min.js"></script>
	<title>Building</title>
	
	<script>
		function getURLParameter(sParam) {
			var sPageURL = window.location.search.substring(1);
			var sURLVariables = sPageURL.split('&');
			for (var i = 0; i < sURLVariables.length; i++) {
				var sParameterName = sURLVariables[i].split('=');
				if (sParameterName[0] == sParam) {
					return sParameterName[1];
				}
			}
		}
	
		$(document).ready(function(){
			var id = getURLParameter("id");
			
			if (id!=undefined) {
				var url = 'http://localhost:8080/Demo2/rest/building/' + id
				$.getJSON(url, function(data) {
					$('#onamefield').val(data['official-name']);
					$('#nnamefield').val(data['nick-name']);
				});
			}
			
			$('#saveButton').click(function() {
				var jsonObject = new Object();
 				jsonObject['official-name'] = $('#onamefield').val();
 				jsonObject['nick-name'] = $('#nnamefield').val();
 			
 				var jsonString = JSON.stringify(jsonObject);
 			
				$.ajax({
					type: 'PUT',
					url: 'http://localhost:8080/Demo2/rest/building/' + id,
					dataType: 'json',
					contentType: 'application/json; charset=utf-8',
					data: jsonString,
					success: function (result) {
						window.location = "buildings.html";
					},
					error: function(result, ajaxOptions, thrownError) {
						alert("Errormessage: " + result.status);
						alert(thrownError);
					}
				});
			});
 		});
 		
 		
	</script>
</head>
<body>
	<div id="wrap">
		<header>
			<div>Building Administration</div>
		</header>
		<article>
			Officialname: <input type="text" id="onamefield"/><br/>
			Nickname: <input type="text" id="nnamefield"/><br/>
			<button id="saveButton">Save</button>
		</article>
	</div>
</body>
</html>